

<!DOCTYPE html>
<html lang="zh-CN" data-default-color-scheme=auto>



<head>
  <meta charset="UTF-8">
  <link rel="apple-touch-icon" sizes="76x76" href="/HexoPage/img/favicon.jpeg">
  <link rel="icon" href="/HexoPage/img/favicon.jpeg">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, shrink-to-fit=no">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  
  <meta name="theme-color" content="#2f4154">
  <meta name="author" content="xiaoaodi">
  <meta name="keywords" content="">
  
    <meta name="description" content="js常用的数组和对象的方法(后续待添加)数组的方法 1.Array.map()2.Array.foreach()3.Array.filter()4.Array.every()5.Array.some()6.Array.reduce()7.Array.push()8.Array.pop()9.Array.shift()10.Array.unshift()11.Array.isArray()12.Ar">
<meta property="og:type" content="article">
<meta property="og:title" content="js常用的数组和对象的方法">
<meta property="og:url" content="http://xiao_aodi.gitee.io/hexopage/2022/04/03/%E6%95%B0%E7%BB%84%E5%92%8C%E5%AF%B9%E8%B1%A1%E5%B8%B8%E7%94%A8%E7%9A%84%E6%96%B9%E6%B3%95/index.html">
<meta property="og:site_name" content="~吃椰子灰的胖丁">
<meta property="og:description" content="js常用的数组和对象的方法(后续待添加)数组的方法 1.Array.map()2.Array.foreach()3.Array.filter()4.Array.every()5.Array.some()6.Array.reduce()7.Array.push()8.Array.pop()9.Array.shift()10.Array.unshift()11.Array.isArray()12.Ar">
<meta property="og:locale" content="zh_CN">
<meta property="article:published_time" content="2022-04-03T14:30:00.000Z">
<meta property="article:modified_time" content="2022-04-03T14:50:31.401Z">
<meta property="article:author" content="xiaoaodi">
<meta name="twitter:card" content="summary_large_image">
  
  
  <title>js常用的数组和对象的方法 - ~吃椰子灰的胖丁</title>

  <link  rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4/dist/css/bootstrap.min.css" />


  <link  rel="stylesheet" href="https://cdn.jsdelivr.net/npm/github-markdown-css@4/github-markdown.min.css" />
  <link  rel="stylesheet" href="https://cdn.jsdelivr.net/npm/hint.css@2/hint.min.css" />

  
    
    
      
      <link  rel="stylesheet" href="https://cdn.jsdelivr.net/npm/highlight.js@10/styles/github-gist.min.css" />
    
  

  
    <link  rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@3/dist/jquery.fancybox.min.css" />
  


<!-- 主题依赖的图标库，不要自行修改 -->

<link rel="stylesheet" href="//at.alicdn.com/t/font_1749284_ba1fz6golrf.css">



<link rel="stylesheet" href="//at.alicdn.com/t/font_1736178_lbnruvf0jn.css">


<link  rel="stylesheet" href="/HexoPage/css/main.css" />

<!-- 自定义样式保持在最底部 -->


  <script id="fluid-configs">
    var Fluid = window.Fluid || {};
    var CONFIG = {"hostname":"xiao_aodi.gitee.io","root":"/HexoPage/","version":"1.8.14","typing":{"enable":true,"typeSpeed":70,"cursorChar":"_","loop":false},"anchorjs":{"enable":true,"element":"h1,h2,h3,h4,h5,h6","placement":"right","visible":"hover","icon":""},"progressbar":{"enable":true,"height_px":3,"color":"#29d","options":{"showSpinner":false,"trickleSpeed":100}},"copy_btn":true,"image_zoom":{"enable":true,"img_url_replace":["",""]},"toc":{"enable":true,"headingSelector":"h1,h2,h3,h4,h5,h6","collapseDepth":0},"lazyload":{"enable":false,"loading_img":"/img/loading.gif","onlypost":false,"offset_factor":2},"web_analytics":{"enable":false,"baidu":null,"google":null,"gtag":null,"tencent":{"sid":null,"cid":null},"woyaola":null,"cnzz":null,"leancloud":{"app_id":null,"app_key":null,"server_url":null,"path":"window.location.pathname","ignore_local":false}},"search_path":"/HexoPage/local-search.xml"};
  </script>
  <script  src="/HexoPage/js/utils.js" ></script>
  <script  src="/HexoPage/js/color-schema.js" ></script>
<meta name="generator" content="Hexo 6.1.0"></head>


<body>
  <header style="height: 70vh;">
    <nav id="navbar" class="navbar fixed-top  navbar-expand-lg navbar-dark scrolling-navbar">
  <div class="container">
    <a class="navbar-brand" href="/HexoPage/">
      <strong>Xiao_aodi</strong>
    </a>

    <button id="navbar-toggler-btn" class="navbar-toggler" type="button" data-toggle="collapse"
            data-target="#navbarSupportedContent"
            aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
      <div class="animated-icon"><span></span><span></span><span></span></div>
    </button>
   
      <!-- 天气网 -->
      


    <!-- Collapsible content -->
    <div class="collapse navbar-collapse" id="navbarSupportedContent">
      <ul class="navbar-nav ml-auto text-center">
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/HexoPage/">
                <i class="iconfont icon-home-fill"></i>
                首页
              </a>
            </li>
          
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/HexoPage/archives/">
                <i class="iconfont icon-archive-fill"></i>
                归档
              </a>
            </li>
          
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/HexoPage/categories/">
                <i class="iconfont icon-category-fill"></i>
                分类
              </a>
            </li>
          
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/HexoPage/tags/">
                <i class="iconfont icon-tags-fill"></i>
                标签
              </a>
            </li>
          
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/HexoPage/about/">
                <i class="iconfont icon-user-fill"></i>
                关于
              </a>
            </li>
          
        
        
          <li class="nav-item" id="search-btn">
            <a class="nav-link" target="_self" href="javascript:;" data-toggle="modal" data-target="#modalSearch" aria-label="Search">
              &nbsp;<i class="iconfont icon-search"></i>&nbsp;
            </a>
          </li>
        
        
          <li class="nav-item" id="color-toggle-btn">
            <a class="nav-link" target="_self" href="javascript:;" aria-label="Color Toggle">&nbsp;<i
                class="iconfont icon-dark" id="color-toggle-icon"></i>&nbsp;</a>
          </li>
        
      </ul>
    </div>
  </div>
</nav>

    <div class="banner" id="banner" parallax=true
         style="background: url('/HexoPage/img/wallhaven-wqve97.png') no-repeat center center;
           background-size: cover;">
      <div class="full-bg-img">
        <div class="mask flex-center" style="background-color: rgba(0, 0, 0, 0.3)">
          <div class="page-header text-center fade-in-up">
            <span class="h2" id="subtitle" title="js常用的数组和对象的方法">
              
            </span>
            
              <div class="mt-3">
  
    <span class="post-meta mr-2">
      <i class="iconfont icon-author" aria-hidden="true"></i>
      xiaoaodi
    </span>
  
  
    <span class="post-meta">
      <i class="iconfont icon-date-fill" aria-hidden="true"></i>
      <time datetime="2022-04-03 22:30" pubdate>
        2022年4月3日 晚上
      </time>
    </span>
  
</div>

<div class="mt-1">
  
    <span class="post-meta mr-2">
      <i class="iconfont icon-chart"></i>
      6.8k 字
    </span>
  

  
    <span class="post-meta mr-2">
      <i class="iconfont icon-clock-fill"></i>
      
      
      57 分钟
    </span>
  

  
  
    
      <!-- 不蒜子统计文章PV -->
      <span id="busuanzi_container_page_pv" style="display: none">
        <i class="iconfont icon-eye" aria-hidden="true"></i>
        <span id="busuanzi_value_page_pv"></span> 次
      </span>
    
  
</div>

            
          </div>

          
        </div>
      </div>
    </div>
  </header>

  <main>
    
      

<div class="container-fluid nopadding-x">
  <div class="row nomargin-x">
    <div class="d-none d-lg-block col-lg-2"></div>
    <div class="col-lg-8 nopadding-x-md">
      <div class="container nopadding-x-md" id="board-ctn">
        <div class="py-5" id="board">
          <article class="post-content mx-auto">
            <!-- SEO header -->
            <h1 style="display: none">js常用的数组和对象的方法</h1>
            
              <p class="note note-info">
                
                  本文最后更新于：2022年4月3日 晚上
                
              </p>
            
            <div class="markdown-body">
              <h1 id="js常用的数组和对象的方法-后续待添加"><a href="#js常用的数组和对象的方法-后续待添加" class="headerlink" title="js常用的数组和对象的方法(后续待添加)"></a>js常用的数组和对象的方法(后续待添加)</h1><p>数组的方法</p>
<h5 id="1-Array-map"><a href="#1-Array-map" class="headerlink" title="1.Array.map()"></a>1.Array.map()</h5><h5 id="2-Array-foreach"><a href="#2-Array-foreach" class="headerlink" title="2.Array.foreach()"></a>2.Array.foreach()</h5><h5 id="3-Array-filter"><a href="#3-Array-filter" class="headerlink" title="3.Array.filter()"></a>3.Array.filter()</h5><h5 id="4-Array-every"><a href="#4-Array-every" class="headerlink" title="4.Array.every()"></a>4.Array.every()</h5><h5 id="5-Array-some"><a href="#5-Array-some" class="headerlink" title="5.Array.some()"></a>5.Array.some()</h5><h5 id="6-Array-reduce"><a href="#6-Array-reduce" class="headerlink" title="6.Array.reduce()"></a>6.Array.reduce()</h5><h5 id="7-Array-push"><a href="#7-Array-push" class="headerlink" title="7.Array.push()"></a>7.Array.push()</h5><h5 id="8-Array-pop"><a href="#8-Array-pop" class="headerlink" title="8.Array.pop()"></a>8.Array.pop()</h5><h5 id="9-Array-shift"><a href="#9-Array-shift" class="headerlink" title="9.Array.shift()"></a>9.Array.shift()</h5><h5 id="10-Array-unshift"><a href="#10-Array-unshift" class="headerlink" title="10.Array.unshift()"></a>10.Array.unshift()</h5><h5 id="11-Array-isArray"><a href="#11-Array-isArray" class="headerlink" title="11.Array.isArray()"></a>11.Array.isArray()</h5><h5 id="12-Array-concat"><a href="#12-Array-concat" class="headerlink" title="12.Array.concat()"></a>12.Array.concat()</h5><h5 id="13-Array-toString"><a href="#13-Array-toString" class="headerlink" title="13.Array.toString()"></a>13.Array.toString()</h5><h5 id="14-Array-join"><a href="#14-Array-join" class="headerlink" title="14.Array.join()"></a>14.Array.join()</h5><h5 id="15-Array-splice"><a href="#15-Array-splice" class="headerlink" title="15.Array.splice()"></a>15.Array.splice()</h5><h5 id="16-Array-slice"><a href="#16-Array-slice" class="headerlink" title="16.Array.slice()"></a>16.Array.slice()</h5><h5 id="17-Array-includes"><a href="#17-Array-includes" class="headerlink" title="17.Array.includes()"></a>17.Array.includes()</h5><h5 id="18-Array-indexOf"><a href="#18-Array-indexOf" class="headerlink" title="18.Array.indexOf()"></a>18.Array.indexOf()</h5><h5 id="19-Array-sort"><a href="#19-Array-sort" class="headerlink" title="19.Array.sort()"></a>19.Array.sort()</h5><h5 id="20-Array-fill"><a href="#20-Array-fill" class="headerlink" title="20.Array.fill()"></a>20.Array.fill()</h5><h5 id="21-str-charCodeAt"><a href="#21-str-charCodeAt" class="headerlink" title="21.str.charCodeAt()"></a>21.str.charCodeAt()</h5><figure class="highlight js"><table><tr><td class="gutter"><div class="code-wrapper"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br><span class="line">75</span><br><span class="line">76</span><br><span class="line">77</span><br><span class="line">78</span><br><span class="line">79</span><br><span class="line">80</span><br><span class="line">81</span><br><span class="line">82</span><br><span class="line">83</span><br><span class="line">84</span><br><span class="line">85</span><br><span class="line">86</span><br><span class="line">87</span><br><span class="line">88</span><br><span class="line">89</span><br><span class="line">90</span><br><span class="line">91</span><br><span class="line">92</span><br><span class="line">93</span><br><span class="line">94</span><br><span class="line">95</span><br><span class="line">96</span><br><span class="line">97</span><br><span class="line">98</span><br><span class="line">99</span><br><span class="line">100</span><br><span class="line">101</span><br><span class="line">102</span><br><span class="line">103</span><br><span class="line">104</span><br><span class="line">105</span><br><span class="line">106</span><br><span class="line">107</span><br><span class="line">108</span><br><span class="line">109</span><br><span class="line">110</span><br><span class="line">111</span><br><span class="line">112</span><br><span class="line">113</span><br><span class="line">114</span><br><span class="line">115</span><br><span class="line">116</span><br><span class="line">117</span><br><span class="line">118</span><br><span class="line">119</span><br><span class="line">120</span><br><span class="line">121</span><br><span class="line">122</span><br><span class="line">123</span><br><span class="line">124</span><br><span class="line">125</span><br><span class="line">126</span><br><span class="line">127</span><br><span class="line">128</span><br><span class="line">129</span><br><span class="line">130</span><br><span class="line">131</span><br><span class="line">132</span><br><span class="line">133</span><br><span class="line">134</span><br><span class="line">135</span><br><span class="line">136</span><br><span class="line">137</span><br><span class="line">138</span><br><span class="line">139</span><br><span class="line">140</span><br><span class="line">141</span><br><span class="line">142</span><br><span class="line">143</span><br><span class="line">144</span><br><span class="line">145</span><br><span class="line">146</span><br><span class="line">147</span><br><span class="line">148</span><br><span class="line">149</span><br><span class="line">150</span><br><span class="line">151</span><br><span class="line">152</span><br></pre></div></td><td class="code"><pre><code class="hljs js"><span class="hljs-comment">//本章总结数组中的各种常用的方法</span><br><span class="hljs-comment">//1.map方法</span><br><span class="hljs-comment">//此方法是给数组中的每项数据都添加一个方法，结果作为一个新的数组返回，并不会改变原来的数组。</span><br><span class="hljs-keyword">let</span> arr = [<span class="hljs-number">1</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> arrCopy = arr.<span class="hljs-title function_">map</span>(<span class="hljs-function"><span class="hljs-params">value</span> =&gt;</span> value *<span class="hljs-number">2</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(arrCopy) <span class="hljs-comment">//[ 2, 6, 8, 10 ]</span><br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(arr) <span class="hljs-comment">//[ 1, 3, 4, 5 ]</span><br><br><span class="hljs-comment">// 2.foreach方法</span><br><span class="hljs-comment">// 此方法是给数组的每一项数据循环添加一个方法，和map不同的是，forEach改变原数组，没有返回值。</span><br><span class="hljs-keyword">let</span> arr2 = [<span class="hljs-number">1</span>,<span class="hljs-number">1</span>,<span class="hljs-number">23</span>,<span class="hljs-number">3</span>]<br>arr2.<span class="hljs-title function_">forEach</span>(<span class="hljs-keyword">function</span>(<span class="hljs-params">value, item</span>) &#123;<br>    arr[item] = value * <span class="hljs-number">10</span><br>&#125;)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;2:&quot;</span>,arr2)  <span class="hljs-comment">//[ 10, 10, 230, 30 ]</span><br><br><span class="hljs-comment">// 3.filter 过滤大于2的数值</span><br><span class="hljs-comment">// 此方法类似于筛选向方法中传入一个判断条件，将满足条件的值变成一个新的数组返回。</span><br><span class="hljs-keyword">let</span> arr3 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> res3 = arr3.<span class="hljs-title function_">filter</span>(<span class="hljs-function"><span class="hljs-params">item</span>=&gt;</span> item &gt; <span class="hljs-number">2</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(res3) <span class="hljs-comment">//[ 3, 4, 5 ]</span><br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(arr3)  <span class="hljs-comment">//[ 1, 2, 3, 4, 5 ]</span><br><br><span class="hljs-comment">// 4. every函数 所有的值都满足条件返回true</span><br><span class="hljs-comment">// 此方法是将所有元素进行判断返回一个布尔值，如果所有元素都满足判断条件的话</span><br><span class="hljs-comment">// 则返回true，如果不满足就返回 false。遍历数组每一项，若全部为true，才返回true ,否则返回false</span><br><span class="hljs-keyword">let</span> arr4 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> res4 = arr.<span class="hljs-title function_">every</span>(<span class="hljs-function"><span class="hljs-params">item</span>=&gt;</span> item &gt; <span class="hljs-number">0</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(res4)  <span class="hljs-comment">//true</span><br><span class="hljs-keyword">let</span> resx4 = arr.<span class="hljs-title function_">every</span>(<span class="hljs-function"><span class="hljs-params">item</span> =&gt;</span> item &gt;<span class="hljs-number">1</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(resx4) <span class="hljs-comment">//false</span><br><br><span class="hljs-comment">// 5. Array.some()</span><br><span class="hljs-comment">// 此方法和every类似，唯一区别就是some遍历数组中的每一项，</span><br><span class="hljs-comment">// 若其中一项为true,则返回值是true，every遍历数组每一项，若全部为true，才返回true ,否则返回false。</span><br><span class="hljs-keyword">let</span> arr5 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> res5 = arr.<span class="hljs-title function_">some</span>(<span class="hljs-function"><span class="hljs-params">item</span>=&gt;</span> item &gt; <span class="hljs-number">6</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(res5)  <span class="hljs-comment">//false</span><br><span class="hljs-keyword">let</span> resx5 = arr.<span class="hljs-title function_">some</span>(<span class="hljs-function"><span class="hljs-params">item</span> =&gt;</span> item &gt;<span class="hljs-number">4</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(resx5) <span class="hljs-comment">//true</span><br><br><span class="hljs-comment">// 6.Array.reduce()</span><br><span class="hljs-comment">// reduce 为数组中的每一个元素依次执行回调函数，不包括数组中被删除或从未被赋值的元素，</span><br><span class="hljs-comment">// 接受四个参数：初始值（或者上一次回调函数的返回值），当前元素值，当前索引，调用 reduce 的数组。可以用来写求和求积。</span><br><span class="hljs-keyword">let</span> arr6 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> res6 = arr6.<span class="hljs-title function_">reduce</span>(<span class="hljs-function">(<span class="hljs-params">pre,item</span>)=&gt;</span>pre+ item)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(res6) <span class="hljs-comment">//15 求和</span><br><span class="hljs-keyword">let</span> resx6 = arr6.<span class="hljs-title function_">reduce</span>(<span class="hljs-function">(<span class="hljs-params">pre,item</span>)=&gt;</span>pre * item) <br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(resx6) <span class="hljs-comment">//120  求积</span><br><br><span class="hljs-comment">// 7.Array.push()</span><br><span class="hljs-comment">// 此方法用来向数组末尾添加一个或多个元素，返回新增后数组的长度。</span><br><span class="hljs-keyword">let</span> arr7 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> length7 = arr7.<span class="hljs-title function_">push</span>(<span class="hljs-number">6</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(length7,arr7)<span class="hljs-comment">//6 [ 1, 2, 3, 4, 5, 6 ]</span><br><br><span class="hljs-comment">// 8.Array.pop()</span><br><span class="hljs-comment">// 此方法删除数组中的最后一位元素，并返回数组，改变数组的长度。</span><br><span class="hljs-keyword">let</span> arr8 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> length8 = arr8.<span class="hljs-title function_">pop</span>() <br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(length8,arr8) <span class="hljs-comment">//5 [ 1, 2, 3, 4 ]</span><br><br><span class="hljs-comment">// 9.Array.shift()</span><br><span class="hljs-comment">// 此方法删除数组中的第一个元素，并返回数组，此方法会改变数组长度。</span><br><span class="hljs-keyword">let</span> arr9 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> length9 = arr9.<span class="hljs-title function_">shift</span>()<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(length9, arr9) <span class="hljs-comment">//1 [ 2, 3, 4, 5 ]</span><br><br><span class="hljs-comment">// 10.Array.unshift()</span><br><span class="hljs-comment">// 此方法向数组前添加一个或多个元素，并返回数组，此方法会改变数组长度。</span><br><span class="hljs-keyword">let</span> arr10 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> length10 = arr10.<span class="hljs-title function_">unshift</span>(<span class="hljs-number">3</span>,<span class="hljs-number">2</span>,<span class="hljs-number">1</span>,<span class="hljs-number">0</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(length10, arr10) <span class="hljs-comment">// 9 [3, 2, 1, 0, 1,2, 3, 4, 5]</span><br><br><span class="hljs-comment">// 11.Array.isArray()</span><br><span class="hljs-comment">// 此方法是用来判断一个对象是不是数组，是的话返回true，不是返回false。</span><br><span class="hljs-keyword">let</span> obj = &#123;&#125;<br><span class="hljs-keyword">let</span> arr11 =[<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-title class_">Array</span>.<span class="hljs-title function_">isArray</span>(arr11),<span class="hljs-title class_">Array</span>.<span class="hljs-title function_">isArray</span>(obj)) <span class="hljs-comment">//true  false</span><br><br><span class="hljs-comment">// 12.Array.concat()</span><br><span class="hljs-comment">// 此方法是一个可以将多个数组合并成一个数组的方法。</span><br><span class="hljs-keyword">let</span> arr12 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> arrsub12 = [<span class="hljs-number">6</span>,<span class="hljs-number">7</span>,<span class="hljs-number">8</span>,<span class="hljs-number">9</span>]<br><span class="hljs-keyword">let</span> length12= arr12.<span class="hljs-title function_">concat</span>(arrsub12)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(arr12,length12) <span class="hljs-comment">//[ 1, 2, 3, 4, 5 ] [1, 2, 3, 4, 5,6, 7, 8, 9]</span><br><br><span class="hljs-comment">// 13.Array.toString()</span><br><span class="hljs-comment">// 此方法是用来将数组转变为字符串格式。</span><br><span class="hljs-keyword">let</span> arr13 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> str = arr13.<span class="hljs-title function_">toString</span>()<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;13:&quot;</span>,str,<span class="hljs-keyword">typeof</span> str) <span class="hljs-comment">//1,2,3,4,5 string</span><br><br><span class="hljs-comment">// 14.Array.join()</span><br><span class="hljs-comment">// 此方法也是将数组转换为字符串，但和toString不同的是join可以设置元素之间的间隔。</span><br><span class="hljs-keyword">let</span> arr14 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> str14 = arr13.<span class="hljs-title function_">join</span>(<span class="hljs-string">&#x27;-&#x27;</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;14:&quot;</span>,str14,<span class="hljs-keyword">typeof</span> str14) <span class="hljs-comment">//1-2-3-4-5 string</span><br><br><span class="hljs-comment">// 15.Array.splice(开始位置， 删除的个数，元素)</span><br><span class="hljs-comment">// 万能的方法可以实现数组的增、删、改。</span><br><span class="hljs-comment">// 删数组内的元素：</span><br><span class="hljs-keyword">let</span> arr15 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> res15 = arr15.<span class="hljs-title function_">splice</span>(<span class="hljs-number">0</span>,<span class="hljs-number">3</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;15&quot;</span>,res15 , arr15) <span class="hljs-comment">//[ 1, 2, 3 ]  [ 4, 5 ]</span><br><span class="hljs-keyword">let</span> arrsub15 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> ressub15 = arrsub15.<span class="hljs-title function_">splice</span>(<span class="hljs-number">1</span>,<span class="hljs-number">0</span>,<span class="hljs-number">6</span>) <span class="hljs-comment">//增加一个元素</span><br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;15:&quot;</span>,ressub15 , arrsub15) <span class="hljs-comment">//[] [ 1, 6, 2, 3, 4, 5 ]</span><br><br><span class="hljs-comment">// 16.Array.slice()</span><br><span class="hljs-comment">// 此方法返回从原数组中指定开始下表到结束下表之间的项组成的新数组（原数组不变）截取数组。</span><br><span class="hljs-keyword">let</span> arr16 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> res16 = arr16.<span class="hljs-title function_">slice</span>(<span class="hljs-number">0</span>,<span class="hljs-number">3</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;16:&quot;</span>,arr16,res16)  <span class="hljs-comment">//[ 1, 2, 3, 4, 5 ] [ 1, 2, 3 ]</span><br><br><span class="hljs-comment">// 17.Array.includes()</span><br><span class="hljs-comment">// 此方法用来判断数组中是否有传入的元素，有的话返回true，没有的话返回false。</span><br><span class="hljs-keyword">let</span> arr17 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> res17 = arr17.<span class="hljs-title function_">includes</span>(<span class="hljs-number">1</span>);<br><span class="hljs-keyword">let</span> ressub17 = arr17.<span class="hljs-title function_">includes</span>(<span class="hljs-number">6</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;17:&quot;</span>,res17,ressub17) <span class="hljs-comment">//true false</span><br><br><span class="hljs-comment">// 18.Array.indexOf()</span><br><span class="hljs-comment">// 从数组的开头向后查找，接受两个参数，要查找的项和查找起点的位置索引。</span><br><span class="hljs-keyword">let</span> arr18 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> res18 = arr18.<span class="hljs-title function_">indexOf</span>(<span class="hljs-number">3</span>,<span class="hljs-number">1</span>)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;18:&quot;</span>,res18,arr18) <span class="hljs-comment">//18: 2 [ 1, 2, 3, 4, 5 ]</span><br><br><span class="hljs-comment">// 19.Array.sort()</span><br><span class="hljs-comment">// 按指定的参数对数组进行排序，返回的值是经过排序后的数组（无参，函数）</span><br><span class="hljs-keyword">let</span> arr19 = [<span class="hljs-number">1</span>,<span class="hljs-number">123</span>,<span class="hljs-number">2</span>,<span class="hljs-number">2</span>,<span class="hljs-number">123</span>,<span class="hljs-number">231</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-keyword">let</span> res19 = arr19.<span class="hljs-title function_">sort</span>(<span class="hljs-function">(<span class="hljs-params">a,b</span>)=&gt;</span>a-b)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;19:&quot;</span>,res19) <span class="hljs-comment">//19: [ 1,   2,   2,   3, 4, 5, 123, 123, 231]</span><br><span class="hljs-keyword">let</span> ressub19 = arr19.<span class="hljs-title function_">sort</span>(<span class="hljs-function">(<span class="hljs-params">a,b</span>)=&gt;</span>b-a)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;19:&quot;</span>,ressub19) <span class="hljs-comment">//19: [ 231, 123, 123, 5, 4, 3,   2,   2, 1]</span><br><br><span class="hljs-comment">// 20.Array.fill()</span><br><span class="hljs-comment">// 此方法用来替换数组中的元素，会改变原数组</span><br><span class="hljs-comment">// 。接受三个参数，第一个参数为替换的值，如果只传入一个值会吧数组中的值全部替换。</span><br><span class="hljs-keyword">let</span> arr20 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br>arr20.<span class="hljs-title function_">fill</span>(<span class="hljs-number">1</span>,<span class="hljs-number">3</span>,<span class="hljs-number">5</span>) <span class="hljs-comment">//[ 1, 2, 3, 1, 1 ]</span><br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;20:&quot;</span>,arr20) <br><span class="hljs-keyword">let</span> arrsub20 = [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>,<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;20:&quot;</span>,arrsub20.<span class="hljs-title function_">fill</span>(<span class="hljs-number">1</span>)) <span class="hljs-comment">//[ 1, 1, 1, 1, 1 ]</span><br><br><br><span class="hljs-comment">// 21.str.charCodeAt()</span><br><span class="hljs-comment">// 字符串字符转化为数字</span><br><span class="hljs-keyword">let</span> ch =<span class="hljs-string">&quot;a&quot;</span><br><span class="hljs-keyword">let</span> resch = ch.<span class="hljs-title function_">charCodeAt</span>()<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;21:&quot;</span>,ch.<span class="hljs-title function_">charCodeAt</span>(),<span class="hljs-keyword">typeof</span> ch.<span class="hljs-title function_">charCodeAt</span>() ,resch) <span class="hljs-comment">//21: 97 number 97</span><br><br></code></pre></td></tr></table></figure>



<h1 id="对象的方法"><a href="#对象的方法" class="headerlink" title="对象的方法"></a>对象的方法</h1><h5 id="1-Object-assign"><a href="#1-Object-assign" class="headerlink" title="1.Object.assign()"></a>1.Object.assign()</h5><h5 id="2-Object-is"><a href="#2-Object-is" class="headerlink" title="2.Object.is()"></a>2.Object.is()</h5><h5 id="3-Object-keys"><a href="#3-Object-keys" class="headerlink" title="3.Object.keys()"></a>3.Object.keys()</h5><h5 id="4-Object-defineProperty"><a href="#4-Object-defineProperty" class="headerlink" title="4.Object.defineProperty()"></a>4.Object.defineProperty()</h5><h5 id="5-Object-defineProperties"><a href="#5-Object-defineProperties" class="headerlink" title="5.Object.defineProperties()"></a>5.Object.defineProperties()</h5><h5 id="6-Object-isPrototypeOf"><a href="#6-Object-isPrototypeOf" class="headerlink" title="6.Object.isPrototypeOf()"></a>6.Object.isPrototypeOf()</h5><figure class="highlight js"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br></pre></td><td class="code"><pre><code class="hljs js"><span class="hljs-comment">// &#123;/* &lt;&gt;------------------------------------- */&#125;</span><br><span class="hljs-comment">// &#123;/* &lt;&gt;------------------------------------- */&#125;</span><br><span class="hljs-comment">// &#123;/* &lt;&gt;------------------------------------- */&#125;</span><br><br><span class="hljs-comment">// 总结对象的方法</span><br><span class="hljs-comment">// 1.Object.assign()</span><br><span class="hljs-comment">// 此方法用于克隆对象，传入两个参数，</span><br><span class="hljs-comment">// 第一个参数为原对象，第二个参数为需要克隆的对象。会合并为一个新的对象，改变第一个参数的对象。</span><br><br><span class="hljs-keyword">let</span> obj1 = &#123;<span class="hljs-attr">name</span>:<span class="hljs-string">&quot;aodi&quot;</span>,<span class="hljs-attr">age</span>:<span class="hljs-number">19</span>&#125;<br><span class="hljs-keyword">let</span> objsub1 = &#123;<span class="hljs-attr">sex</span>:<span class="hljs-string">&quot;man&quot;</span>&#125;<br><span class="hljs-keyword">let</span> resobj1 = <span class="hljs-title class_">Object</span>.<span class="hljs-title function_">assign</span>(obj1,objsub1)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;1:&quot;</span>,resobj1)<span class="hljs-comment">//1: &#123; name: &#x27;aodi&#x27;, age: 19, sex: &#x27;man&#x27; &#125;</span><br><br><span class="hljs-comment">// 2.Object.is()</span><br><span class="hljs-comment">// 此方法是用来比较的接受两个参数，第一个参数是需要比较的第一个值，第二个参数是需要比较的第二个值。</span><br><span class="hljs-comment">// 返回值：布尔值，如果两个值相同返回true，不相同返回false。</span><br><span class="hljs-comment">// 注意，该函数与==运算符不同，不会强制转换任何类型，</span><br><span class="hljs-comment">// 应该更加类似于**===，但值得注意的是它会将+0和-0视作不同值**</span><br><span class="hljs-keyword">let</span> obj2 = <span class="hljs-number">1</span>;<br><span class="hljs-keyword">let</span> objsub2 = <span class="hljs-number">1</span><br><span class="hljs-keyword">let</span> objsub22 = <span class="hljs-number">3</span><br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">&quot;2:&quot;</span>,<span class="hljs-title class_">Object</span>.<span class="hljs-title function_">is</span>(obj2,objsub2),<span class="hljs-title class_">Object</span>.<span class="hljs-title function_">is</span>(objsub22,objsub2),) <span class="hljs-comment">//true false</span><br><br><span class="hljs-comment">// 3.Object.keys()</span><br><span class="hljs-comment">// 此方法是用来获取对象的key值的。返回一个包含key值的数组。</span><br><span class="hljs-keyword">let</span> obj3 = &#123;<span class="hljs-attr">name</span>:<span class="hljs-string">&quot;aodi&quot;</span>,<span class="hljs-attr">age</span>:<span class="hljs-number">19</span>&#125;<br><span class="hljs-keyword">let</span> rse3s= <span class="hljs-title class_">Object</span>.<span class="hljs-title function_">keys</span>(obj3)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(rse3s) <span class="hljs-comment">//[ &#x27;name&#x27;, &#x27;age&#x27; ]</span><br><br><span class="hljs-comment">// 4.Object.defineProperty()</span><br><span class="hljs-comment">// defineProperty为设置对象的属性的属性特征 value设置属性名，enumerable设置该属性是否可以被枚举。未设置的枚举的属性不能被for in遍历和keys获取。</span><br><span class="hljs-comment">// 该方法接受三个参数，第一个参数为要加入属性的对象，第二个参数为属性的key值，第三个参数为一个对象。</span><br><span class="hljs-keyword">let</span> obj4 = &#123;&#125;<br><span class="hljs-keyword">let</span> objsub4 = &#123;&#125;<br><span class="hljs-title class_">Object</span>.<span class="hljs-title function_">defineProperty</span>(obj4,<span class="hljs-string">&quot;name&quot;</span>,&#123;<br>    <span class="hljs-attr">value</span>:<span class="hljs-string">&quot;aodi&quot;</span>,<br>    <span class="hljs-attr">enumerable</span>:<span class="hljs-literal">true</span><br>&#125;)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(obj4) <span class="hljs-comment">//&#123; name: &#x27;aodi&#x27; &#125;</span><br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(objsub4) <span class="hljs-comment">//&#123;&#125;</span><br><br><span class="hljs-comment">// 5.Object.defineProperties()</span><br><span class="hljs-comment">// 可添加多个属性,与Object.defineProperty()对应。</span><br><span class="hljs-keyword">let</span> obj5 =&#123;&#125;<br><span class="hljs-title class_">Object</span>.<span class="hljs-title function_">defineProperties</span>(obj5,&#123;<br>    <span class="hljs-attr">name</span>:&#123;<br>        <span class="hljs-attr">value</span>:<span class="hljs-string">&quot;aodi&quot;</span>,<br>        <span class="hljs-attr">enumerable</span>:<span class="hljs-literal">true</span><br>    &#125;,<br>    <span class="hljs-attr">age</span>:&#123;<br>        <span class="hljs-attr">value</span>:<span class="hljs-number">10</span>,<br>        <span class="hljs-attr">enumerable</span>:<span class="hljs-literal">true</span><br>    &#125;<br>&#125;)<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(obj5) <span class="hljs-comment">//&#123; name: &#x27;aodi&#x27;, age: 10 &#125;</span><br><br><span class="hljs-comment">// 6.Object.isPrototypeOf()</span><br><span class="hljs-comment">// 此方法是用来检查一个对象是否存在另一个对象的原型链中。</span><br><span class="hljs-keyword">function</span> <span class="hljs-title function_">func</span>(<span class="hljs-params"></span>)&#123;&#125;<br><span class="hljs-keyword">let</span> obj6 = <span class="hljs-keyword">new</span> <span class="hljs-title function_">func</span>()<br><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-title class_">Object</span>.<span class="hljs-property"><span class="hljs-keyword">prototype</span></span>.<span class="hljs-title function_">isPrototypeOf</span>(obj6)) <span class="hljs-comment">// true</span><br><br></code></pre></td></tr></table></figure>


            </div>
            <hr>
            <div>
              <div class="post-metas mb-3">
                
                
              </div>
              <p class="note note-warning">
                <strong>本文作者: </strong><a href="/HexoPage/">xiao_aodi</a> <br>
                <!-- <strong>本文链接: </strong><a href="http://xiao_aodi.gitee.io/hexopage/2022/04/03/%E6%95%B0%E7%BB%84%E5%92%8C%E5%AF%B9%E8%B1%A1%E5%B8%B8%E7%94%A8%E7%9A%84%E6%96%B9%E6%B3%95/">http://xiao_aodi.gitee.io/hexopage/2022/04/03/%E6%95%B0%E7%BB%84%E5%92%8C%E5%AF%B9%E8%B1%A1%E5%B8%B8%E7%94%A8%E7%9A%84%E6%96%B9%E6%B3%95/</a> <br> -->
                <strong>版权声明: </strong>本博客所有文章除特别声明外，均采用 <a target="_blank" href="https://creativecommons.org/licenses/by-sa/4.0/deed.zh" rel="nofollow noopener noopener">CC BY-SA 4.0 协议</a> ，转载请注明出处！
                   </p>
                   

              
                <div class="post-prevnext">
                  <article class="post-prev col-6">
                    
                    
                  </article>
                  <article class="post-next col-6">
                    
                    
                      <a href="/HexoPage/2022/03/26/ES%E5%85%A8%E7%B3%BB%E5%88%97%E8%AF%A6%E7%BB%86%E5%AD%A6%E4%B9%A0%E7%AC%94%E8%AE%B0/">
                        <span class="hidden-mobile">ES全系列详细学习笔记</span>
                        <span class="visible-mobile">下一篇</span>
                        <i class="iconfont icon-arrowright"></i>
                      </a>
                    
                  </article>
                </div>
              
            </div>

            
          </article>
        </div>
      </div>
    </div>
    
      <div class="d-none d-lg-block col-lg-2 toc-container" id="toc-ctn">
        <div id="toc">
  <p class="toc-header"><i class="iconfont icon-list"></i>&nbsp;目录</p>
  <div class="toc-body" id="toc-body"></div>
</div>

      </div>
    
  </div>
</div>

<!-- Custom -->


    

    
      <a id="scroll-top-button" aria-label="TOP" href="#" role="button">
        <i class="iconfont icon-arrowup" aria-hidden="true"></i>
      </a>
    

    
      <div class="modal fade" id="modalSearch" tabindex="-1" role="dialog" aria-labelledby="ModalLabel"
     aria-hidden="true">
  <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header text-center">
        <h4 class="modal-title w-100 font-weight-bold">搜索</h4>
        <button type="button" id="local-search-close" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body mx-3">
        <div class="md-form mb-5">
          <input type="text" id="local-search-input" class="form-control validate">
          <label data-error="x" data-success="v"
                 for="local-search-input">关键词</label>
        </div>
        <div class="list-group" id="local-search-result"></div>
      </div>
    </div>
  </div>
</div>
    

    
  </main>

  <footer class="text-center mt-5 py-3">
  
   <a href="https://hexo.io" target="_blank" rel="nofollow noopener"><span>Hexo</span></a> <i class="iconfont icon-love"></i> <a href="https://github.com/fluid-dev/hexo-theme-fluid" target="_blank" rel="nofollow noopener"><span>Fluid</span></a>  
  <!-- 添加网站运行时间 -->
  <div class="footer-content">
    <div>
      <span id="timeDate">载入天数...</span>
      <span id="times">载入时分秒...</span>
      <script>
      var now = new Date();
      function createtime(){
          var grt= new Date("03/10/2022 00:00:00");//此处修改你的建站时间或者网站上线时间
          now.setTime(now.getTime()+250);
          days = (now - grt ) / 1000 / 60 / 60 / 24;
          dnum = Math.floor(days);
          hours = (now - grt ) / 1000 / 60 / 60 - (24 * dnum);
          hnum = Math.floor(hours);
          if(String(hnum).length ==1 ){
              hnum = "0" + hnum;
          }
          minutes = (now - grt ) / 1000 /60 - (24 * 60 * dnum) - (60 * hnum);
          mnum = Math.floor(minutes);
          if(String(mnum).length ==1 ){
                    mnum = "0" + mnum;
          }
          seconds = (now - grt ) / 1000 - (24 * 60 * 60 * dnum) - (60 * 60 * hnum) - (60 * mnum);
          snum = Math.round(seconds);
          if(String(snum).length ==1 ){
                    snum = "0" + snum;
          }
          document.getElementById("timeDate").innerHTML = "🚀 &nbsp"+dnum+"&nbsp天";  //此次自定义显示内容
          document.getElementById("times").innerHTML = hnum + "&nbsp小时&nbsp" + mnum + "&nbsp分&nbsp" + snum + "&nbsp秒";
      }  //此次自定义显示内容
      setInterval("createtime()",250);
      </script>
    </div>
  </div>
  <!-- 统计访问量信息 -->
  
  <div class="statistics">
    
    

    
      
        <!-- 不蒜子统计PV -->
        <span id="busuanzi_container_site_pv" style="display: none">
            总访问量 
            <span id="busuanzi_value_site_pv"></span>
             次
          </span>
      
      
        <!-- 不蒜子统计UV -->
        <span id="busuanzi_container_site_uv" style="display: none">
            总访客数 
            <span id="busuanzi_value_site_uv"></span>
             人
          </span>
      
    
  </div>


  <!-- 个人和备案信息 -->
  <div>©2022-2023<a target="_blank" rel="noopener" href="https://clearlight.blog.csdn.net/">ClearlightY</a> <a target="_blank" rel="noopener" href="http://beian.miit.gov.cn/">冀ICP备19019307号-2</a></div>
   
  <!-- 备案信息 -->
  <div class="beian">
    <span>
      <a href="http://beian.miit.gov.cn/" target="_blank" rel="nofollow noopener">
        京ICP证123456号
      </a>
    </span>
    
      
        <span>
          <a
            href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=12345678"
            rel="nofollow noopener"
            class="beian-police"
            target="_blank"
          >
            
              <span style="visibility: hidden; width: 0">|</span>
              <img src="/HexoPage/img/police_beian.png" alt="police-icon"/>
            
            <span>京公网安备12345678号</span>
          </a>
        </span>
      
    
  </div>


  
</footer>

<!-- SCRIPTS -->

  <script  src="https://cdn.jsdelivr.net/npm/nprogress@0/nprogress.min.js" ></script>
  <link  rel="stylesheet" href="https://cdn.jsdelivr.net/npm/nprogress@0/nprogress.min.css" />

  <script>
    NProgress.configure({"showSpinner":false,"trickleSpeed":100})
    NProgress.start()
    window.addEventListener('load', function() {
      NProgress.done();
    })
  </script>


<script  src="https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js" ></script>
<script  src="https://cdn.jsdelivr.net/npm/bootstrap@4/dist/js/bootstrap.min.js" ></script>
<script  src="/HexoPage/js/events.js" ></script>
<script  src="/HexoPage/js/plugins.js" ></script>

<!-- Plugins -->


  <script  src="/HexoPage/js/local-search.js" ></script>





  



  
    <script  src="https://cdn.jsdelivr.net/npm/tocbot@4/dist/tocbot.min.js" ></script>
  
  
    <script  src="https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@3/dist/jquery.fancybox.min.js" ></script>
  
  
    <script  src="https://cdn.jsdelivr.net/npm/anchor-js@4/anchor.min.js" ></script>
  
  
    <script defer src="https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js" ></script>
  



  <script defer src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js" ></script>




  <script  src="https://cdn.jsdelivr.net/npm/typed.js@2/lib/typed.min.js" ></script>
  <script>
    (function (window, document) {
      var typing = Fluid.plugins.typing;
      var title = document.getElementById('subtitle').title;
      
        typing(title);
      
    })(window, document);
  </script>















<!-- 主题的启动项 保持在最底部 -->
<script  src="/HexoPage/js/boot.js" ></script>




  <!-- SCRIPTS -->
  
  <script  src="https://cdn.jsdelivr.net/npm/nprogress@0/nprogress.min.js" ></script>
  <link  rel="stylesheet" href="https://cdn.jsdelivr.net/npm/nprogress@0/nprogress.min.css" />

  <script>
    NProgress.configure({"showSpinner":false,"trickleSpeed":100})
    NProgress.start()
    window.addEventListener('load', function() {
      NProgress.done();
    })
  </script>


<script  src="https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js" ></script>
<script  src="https://cdn.jsdelivr.net/npm/bootstrap@4/dist/js/bootstrap.min.js" ></script>
<script  src="/HexoPage/js/events.js" ></script>
<script  src="/HexoPage/js/plugins.js" ></script>

<!-- Plugins -->


  <script  src="/HexoPage/js/local-search.js" ></script>





  



  
    <script  src="https://cdn.jsdelivr.net/npm/tocbot@4/dist/tocbot.min.js" ></script>
  
  
    <script  src="https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@3/dist/jquery.fancybox.min.js" ></script>
  
  
    <script  src="https://cdn.jsdelivr.net/npm/anchor-js@4/anchor.min.js" ></script>
  
  
    <script defer src="https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js" ></script>
  



  <script defer src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js" ></script>




  <script  src="https://cdn.jsdelivr.net/npm/typed.js@2/lib/typed.min.js" ></script>
  <script>
    (function (window, document) {
      var typing = Fluid.plugins.typing;
      var title = document.getElementById('subtitle').title;
      
        typing(title);
      
    })(window, document);
  </script>















<!-- 主题的启动项 保持在最底部 -->
<script  src="/HexoPage/js/boot.js" ></script>


</body>
</html>
